<template>
    <div :style="{minHeight:clientH}">
        <!-- <li class="no_content" v-if="list.length<=0">暂时无内容</li> -->
        <li class="sponsored_item" v-for="(item,index) in list" :key="index + 'sponsore'" @click="approveDetail(item,item.fd_payoutlist_id,item.approve_status_text,item.fd_payoutlist_state)">
            <!-- <h3>费用项目 : {{item.apply_title}} </h3> -->
						<h3>费用项目 : {{item.fee_subject_names}} <span>{{item.fd_payoutlist_date}}</span></h3>
            <p>报销金额：{{item.fd_payoutlist_allmoney}}</p>
            <p>实际出款金额：{{item.fd_actualities_money}}</p>
            <p>单据号：{{item.fd_payoutlist_no}}</p>
																																						
						<div>
							<span v-if="item.fd_payoutlist_state =='0' || item.fd_payoutlist_state =='-1'" class="color_ff0000">状态: {{item.approve_status_text}}</span>
							<span v-else-if="item.fd_payoutlist_state =='99'" class="color_1d8f86">状态: {{item.approve_status_text}}</span>
							<span v-else="item.fd_payoutlist_state !=='99' && item.fd_payoutlist_state !=='0' && item.fd_payoutlist_state !=='-1'" class="color_ff9900">状态: {{item.approve_status_text}}</span>
						</div>
        </li>
    </div>
</template>
<script>
export default {
    name:'ApproveList',
    data(){
        return {
            clientH:0,
            title:''
         }
    },
    props:{
        list:{
            type:Array,
            default:()=>[]
        },
        pageName:{
            type:String,
            default:''
        },
				pageTitle:{
				    type:String,
				    default:''
				},
				get_type:{
				    type:Number,
				    default:0
				},
    },
    mounted(){
        var h = document.body.clientHeight
        this.clientH = h - 160 + 'px';
    },
    methods:{
        approveDetail(item,id,title,state){
					  //4 我发起的 申请总数；5 我发起的 审批中的单；6 我审批的单；7 我审批的单 待我审批；8 我审批的单 我审批过的；
						if(this.get_type == 4){
								if( item.fd_payoutlist_state == 0 || item.fd_payoutlist_state == -1 ){
									//编辑页
									this.$router.push({name: "finApproveEdit",query:{id:id}});
								}else{
									this.$router.push({name: "finApproveDetail",query:{id:id}}); 
									sessionStorage.setItem('getTypeSponsored',4)
								}
						}
						else if(this.get_type == 5 ){
								if( item.fd_payoutlist_state == 0 || item.fd_payoutlist_state == -1 ){
									//编辑页
									this.$router.push({name: "finApproveEdit",query:{id:id}});
								}else{
									this.$router.push({name: "finApproveDetail",query:{id:id}});
									sessionStorage.setItem('getTypeSponsored',5)
								}
						}
						else if(this.get_type == 7){//我审批的单 待我审批
							if( item.fd_payoutlist_state == 8 || item.fd_payoutlist_state == 11 ){
								this.$dialog.alert({
									title: '提示',
									message: '移动端暂时不支持，会计、出纳审批！<br />请登录ERP后台操作审批；'
								});
								return false;
							}else{
								this.$router.push({name: "finApproval",query:{id:id}});
							}
						}else if(this.get_type == 8){//我审批过的列表
								this.$router.push({name: "finApproveDetail",query:{id:id}});
								sessionStorage.setItem('getTypeSponsored',8)
						}
						localStorage.setItem('pageTitle',this.pageTitle)
        }
    }
}
</script>
<style lang="less" scoped>
.sponsored_item{
    width: 100%;
    height: auto;
    padding: 15px;
    background: #fff;
    font-size: 13px;
    color: #626466;
    overflow: hidden;
    box-sizing: border-box;
    border-bottom: 1px solid #f7f7f7;
    h3{
        line-height: 30px;
        font-size: 15px;
        color: #151617;
        font-weight: bolder;
        span{float: right;font-size: 12px;color: #999;font-weight: normal;}
    }
    p{line-height: 24px;}
    div{ line-height: 30px;}
    .approval_success{color: #02ccbd;}
    .approval_warning{color: #feb022;}
    .approval_fail{color: #ff4066;}
		.color_1d8f86{
			color: #1d8f86;
		}
		.color_ff0000{
			color: #ff0000;
		}
		.color_ff9900 {
			color: #ff9900;
		}
}
.no_content{
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 20px;
    text-align: center;
    color: #999;
    margin-top: 100px;
}
</style>